<template>
      <div class='readCardjy' v-loading="loading">
        <el-button type="primary" @click="btnClicks">读取图片</el-button>
       <img id="bigPriDev" width="0" height="0"  :src="src" v-if="isShow"/>
       <el-dialog
            append-to-body
            title="提示"
            :visible.sync="dialogVisible"
            width="500px"
            style="left:25%">
            <div>
                <el-form ref="form" :model="form" label-width="80px">
                    <el-form-item label="逝者姓名">
                        <el-input v-model="datas.labelA"></el-input>
                    </el-form-item>
                    <el-form-item label="逝者性别">
                        <el-input v-model="datas.Sex"></el-input>
                    </el-form-item>
                     <el-form-item label="逝者年龄">
                        <el-input v-model="datas.age"></el-input>
                    </el-form-item>
                     <el-form-item label="身份证号">
                        <el-input v-model="datas.CardNo"></el-input>
                    </el-form-item>
                    <el-form-item label="出生年月">
                        <el-input v-model="datas.Born"></el-input>
                    </el-form-item>
                     <el-form-item label="民族">
                        <el-input v-model="datas.mz"></el-input>
                    </el-form-item>
                     <el-form-item label="死亡日期">
                        <el-input v-model="datas.death"></el-input>
                    </el-form-item>
                     <el-form-item label="户籍地址">
                        <el-input v-model="datas.Address"></el-input>
                    </el-form-item>
                </el-form>

            </div>
            <span slot="footer" class="dialog-footer">
                <el-button @click="dialogVisible2 = true">详 情</el-button>
                <el-button @click="dialogVisible = false">取 消</el-button>
                <el-button type="primary" @click="oks">确 定</el-button>
            </span>
        </el-dialog>
        <el-dialog
            append-to-body
            title="提示"
            :visible.sync="dialogVisible2"
            width="450px"

            style="left:30%;height:650px;overflow:hidden">
            <div style="height:450px;overflow:auto">
                 <div v-html="htmlstr"></div>

            </div>
            <span slot="footer" class="dialog-footer">
                <el-button @click="dialogVisible2 = false">取 消</el-button>
                <el-button type="primary" @click="dialogVisible2 = false">确 定</el-button>
            </span>
        </el-dialog>
    </div>
</template>
<script>
import axios from 'axios'
export default {
    props:['id'],
    name:'read-card-ocrlt',
    data(){
        return{
            datas:{},
            htmlstr:"",
            dialogVisible:false,
            dialogVisible2:false,
           loading:false,
           isClick:true,
           isShow:true,
           src:"http://127.0.0.1:38088/video=stream&camidx=0"
        }
    },
    created(){
       
    },
    methods:{
        btnClicks(){
            if(this.isClick){
                this.loading=true;
                this.isShow=true;
                this.readCard();
            }else{
                this.$message.error('上一次读取还未结束,请不要重复读取');
            }
        },
        readCard(){
           
            let that=this;
             let data = {
                "filepath": "base64",
                "rotate": "0",
                "deskew": "0",
                "camidx": "0",
                "ColorMode": "0",
                "quality": "0"
            }
         
            var ajax = new XMLHttpRequest();
            //步骤二:设置请求的url参数,参数一是请求的类型,参数二是请求的url,可以带参数,动态的传递参数starName到服务端
            let params='filepath=base64&rotate=0&deskew=0&camidx=0&ColorMode=0&quality=0';
            ajax.open('post','http://127.0.0.1:38088/video=grabimage');
            //步骤三:发送请求
            ajax.send(JSON.stringify(data));

            ajax.onreadystatechange = function () {
            if (ajax.readyState==4 &&ajax.status==200) {
                //步骤五 如果能够进到这个判断 说明 数据 完美的回来了,并且请求的页面是存在的
            　　　　//console.log(ajax.responseText,"readCard------------------------");//输入相应的内容
                    let data=JSON.parse(ajax.responseText);
                    //that.isShow=false;
                    if(!data.photoBase64){
                        that.loading=false;
                        return;
                    }
                    that.$post("business","/api/baiduApi/ocr",{img:data.photoBase64}).then(data=>{
                        that.loading=false;
                        let words_result=data.words_result;
                        if(words_result.length>0){
                            let titles="";
                            let words=[{words:"居民死亡殡葬证",type:"标题"},{words:"户口注销证明",type:"标题"},{words:"行政区划代码",type:"行政区划"},{words:"编号",type:"编号"},
                            {words:"死者",type:"逝者姓名"},{words:"姓名",type:"逝者姓名"},{words:"性别",type:"性别"},{words:"民族",type:"民族"},{words:"国家或地区",type:"国家"},{words:"年龄",type:"年龄"},
                            {words:"身份证件",type:"身份证"},{words:"证件",type:"身份证"},{words:"常住",type:"地址"},{ words:"身份证",type:"身份证"},{words:"类别",type:"身份证" },{words:"号码",type:"身份证"},
                            {words:"地址",type:"地址"},{ words:"出生",type:"出生年月"},{ words:"地区",type:"国家"},{ words:"国家",type:"国家"},{ words:"中国",type:"国家"}];
                            for(let i=0;i<words_result.length;i++){
                                let title_=words_result[i].words;
                                if(title_=="居民死亡殡葬证"){
                                    titles=title_;
                                    break;
                                }else if(title_=="户口注销证明"){
                                    titles=title_;
                                    break;
                                }
                            }
                            if(titles=="居民死亡殡葬证"){
                                that.htmlstr="";
                                

                                let datas_=[];
                                let hh=0;
                                let isDate="";
                                for(let h=0;h<words_result.length;h++){
                                    that.htmlstr+=words_result[h].words+"<br/>"
                                    let word_=words_result[h].words;
                                    if(hh>8){
                                        break;
                                    }
                                    let isOk=true;
                                    for(let j=0;j<words.length;j++){
                                        let w=words[j].words;
                                        if(word_.indexOf(w)!=-1){
                                            isOk=false;
                                            break;
                                        }
                                    }
                                    if(isOk){
                                        console.log("h=="+hh+"="+word_)
                                        if(isDate=="Y"){
                                            isDate="";
                                            datas_[hh]=datas_[hh]+word_;
                                        }else{
                                            datas_[hh]=word_;
                                            if(word_.indexOf("_")!=-1&&word_.length==8){
                                                isDate="Y";
                                            }else
                                                hh++;
                                        }
                                        
                                    }
                                }
                                let szname=datas_.length>0 ? datas_[0]:"";
                                let szsex=datas_.length>1 ? datas_[1]:"";
                                let szmz=datas_.length>2 ? datas_[2]:"";
                                let szage=datas_.length>3 ? datas_[3]:"";
                                let szcode=datas_.length>4 ? datas_[4]:"";
                                let szaddress=datas_.length>5 ? datas_[5]:"";
                                let szborth=datas_.length>6 ? datas_[6]:"";
                                let szdeath=datas_.length>7 ? datas_[7]:"";
                                
                                let datas={};
                                datas.Born=szborth;
                                datas.labelA=szname;
                                datas.Sex=szsex;
                                datas.mz=szmz;
                                datas.Address=szaddress;
                                datas.CardNo=szcode;
                                datas.image="";
                                var date = new Date();
                                let curYear=date .getFullYear(); //获取完整的年份(4位)
                                let age=szage.replace("岁","");
                                datas.age=age;
                                datas.death=szdeath;

                                that.datas=datas;

                                that.dialogVisible=true;
                                
                            }else if(titles=="户口注销证明"){
                                let datas_=[];
                                let hh=0;
                                 let words=[{words:"户口注销证明",type:"标题"},{words:"本辖区居民",type:"姓名"},{words:"曾用名",type:""},{words:"性别：",type:"性别"},
                                {words:"出生日期：",type:"出生日期"},{words:"公民身份号码：",type:"身份证"},{words:",户籍地址：",type:"地址"},
                                {words:"日死亡",type:"死亡日期"},{words:",于",type:""}];
                            
                                for(let h=0;h<words_result.length;h++){
                                    let word_=words_result[h].words;
                                    that.htmlstr+=words_result[h].words+"<br/>"
                                    let isOk=true;
                                    for(let j=0;j<words.length;j++){
                                        let w=words[j].words;
                                        let type=words[j].type;
                                 
                                        if(word_.indexOf(w)!=-1){
                                            
                                            isOk=false;
                                            if(type!="标题"&&type!=""){
                                                word_=word_.replace(w,"");
                                                if(type=="死亡日期"){
                                                    word_=word_.replace("因","")
                                                    word_=word_.replace("年","-").replace("月","-")
                                                }
                                                if(type=="地址"){
                                                    word_=word_.replace("、","")
                                                }
                                                if(word_){
                                                    datas_[hh]=word_;
                                                    hh++;
                                                    break;
                                                }
                                            }
                                        }
                                    }
                                    if(isOk){
                                        datas_[hh]=word_;
                                        hh++;
                                    }
                                }
                                let szname=datas_.length>0 ? datas_[0]:"";
                                let szsex=datas_.length>1 ? datas_[1]:"";
                                let szborth=datas_.length>2 ? datas_[2]:"";
                                let szcode=datas_.length>3 ? datas_[3]:"";
                                let szaddress=datas_.length>4 ? datas_[4]:"";
                                let szdeath=datas_.length>5 ? datas_[5]:"";

                                let szmz="";
                                let szage="";
                                
                                let datas={};
                                datas.Born=szborth;
                                datas.labelA=szname;
                                datas.Sex=szsex;
                                datas.mz=szmz;
                                datas.Address=szaddress;
                                datas.CardNo=szcode;
                                datas.image="";
                                var date = new Date();
                                let curYear=date .getFullYear(); //获取完整的年份(4位)
                                let age=szage.replace("岁","");
                                datas.age=age;
                                datas.death=szdeath;

                                that.datas=datas;

                                that.dialogVisible=true;
                                console.log(datas_,"datas_==========================")
                            }
                        }
                    })
            　　}
            }
           
        },
        validateDate(){
            var xxx= this.datas.Born;
            let isOk=true;
            if(xxx){
                 var re =/^(\d{4})-(\d{2})-(\d{2})$/;
                if(!re.test(xxx)){
                    //判断日期格式为YYYY-MM-DD标准
                    this.$message.error('出生日期格式有误，请输入正常格式');
                    isOk=false;
                }
            }
           
            return isOk;
        },
        validateDate2(){
            var xxx= this.datas.death;
            let isOk=true;
            if(xxx){
                var re =/^(\d{4})-(\d{2})-(\d{2})$/;
                if(!re.test(xxx)){
                    //判断日期格式为YYYY-MM-DD标准
                    this.$message.error('死亡日期格式有误，请输入正常格式');
                    isOk=false;
                }
            }
            
            return isOk;
        },
        isCardID(sId){
            var aCity={11:"北京",12:"天津",13:"河北",14:"山西",15:"内蒙古",21:"辽宁",22:"吉林",23:"黑龙江",31:"上海",32:"江苏",33:"浙江",34:"安徽",35:"福建",36:"江西",37:"山东",41:"河南",42:"湖北",43:"湖南",44:"广东",45:"广西",46:"海南",50:"重庆",51:"四川",52:"贵州",53:"云南",54:"西藏",61:"陕西",62:"甘肃",63:"青海",64:"宁夏",65:"新疆",71:"台湾",81:"香港",82:"澳门",91:"国外"};
            
            var iSum=0 ;
            var info="" ;
            if(!/^\d{17}(\d|x)$/i.test(sId)) return "你输入的身份证长度或格式错误,请检查！";
            sId=sId.replace(/x$/i,"a");
            if(aCity[parseInt(sId.substr(0,2))]==null) return "你的身份证地区非法,请检查！";
            var sBirthday=sId.substr(6,4)+"-"+Number(sId.substr(10,2))+"-"+Number(sId.substr(12,2));
            var d=new Date(sBirthday.replace(/-/g,"/")) ;
            if(sBirthday!=(d.getFullYear()+"-"+ (d.getMonth()+1) + "-" + d.getDate()))return "身份证上的出生日期非法,请检查！";
            for(var i = 17;i>=0;i --) iSum += (Math.pow(2,i) % 11) * parseInt(sId.charAt(17 - i),11) ;
            if(iSum%11!=1) return "你输入的身份证号非法,请检查！";
            //aCity[parseInt(sId.substr(0,2))]+","+sBirthday+","+(sId.substr(16,1)%2?"男":"女");//此次还可以判断出输入的身份证号的人性别
            return "";
        },
        oks(){
            let isOk=this.validateDate();
            let msg=this.isCardID(this.datas.CardNo);
            if(msg){
                isOk=false;
                this.$message.error(msg);
            }
            if(isOk)
                isOk=this.validateDate2();
            if(isOk){
                let that=this;
                let ids=that.id.split("|");
                
                for(let i=0;i<ids.length;i++){
                    let id_=ids[i].split(":");
                    //if(id_[0]!="image"){
                        let data={};
                        let val=that.datas[id_[0]];
                        data.id=id_[1];
                        data.val=val;
                        
                        that.$emit("input",JSON.stringify(data));
                // }
                    
                }
                that.dialogVisible=false;
            }
            
        },
        readCard2(){
            this.isClick=false;
            let that=this;
             let data = {
                "ocrflag": "1",
                "picfilepath": "D://ocr6.jpg",
                "savefilepath": "D://ocr.pdf"
            }
          
             var ajax = new XMLHttpRequest();
           
            ajax.open('post','http://127.0.0.1:38088/video=ocr');
            //步骤三:发送请求
            ajax.send(JSON.stringify(data));

            ajax.onreadystatechange = function () {
            if (ajax.readyState==4 &&ajax.status==200) {
                //步骤五 如果能够进到这个判断 说明 数据 完美的回来了,并且请求的页面是存在的
            　　　　console.log(ajax.responseText,"readCardocr------------------------");//输入相应的内容
                   
                  that.isClick=true;
            　　}
            }

            
        }
      
        
    }
}
</script>